<template>
  <div>
    <ky-transfer
      v-model="value"
      class="transfer-center"
      filterable
      :titles="['原主机', '目标主机']"
      :data="data"
    />
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleCancel">{{ $t("cancel") }}</el-button>
      <el-button
        class="kylin-button"
        @click="handleOk"
        :disabled="value.length < 1"
        >{{ $t("configure.issue") }}</el-button
      >
    </div>
  </div>
</template>

<script>
import KyTransfer from "@/components/transfer/index.vue";
import { getMigrateConfigureHosts, issueMigrateConfigure } from "@/api/migrate_diff";
export default {
  components: {
    KyTransfer,
  },
  props: {
    ids: {
      type: Array,
      default: function () {
        return [];
      },
    },
    osVersion: {
      type: String,
    },
    osArch: {
      type: String,
    },
    osName: {
      type: String,
    },
  },
  data() {
    return {
      value: [],
      data: [],
    };
  },
  methods: {
    handleOk() {
        let data = {
            configIds: this.ids,
            hostIds: this.value
        }
        issueMigrateConfigure(data).then(res => {
            if (res.data.code == "0") {
                this.$message({
                    type: "success",
                    message: res.data.message
                })
            } else {
                this.$message({
                    type: "error",
                    message: res.data.message
                })
            }
            this.$emit("click");
            this.$router.push({
              name: "log_detail",
              params: { id: res.data.data.parentId },
            });
        })
    },
    handleCancel() {
      this.$emit("click");
    },
  },

  mounted() {
    let os_info = this.$route.query.os_info;
    let arr = os_info.split("-");
    let osArch = arr[1];
    let osVersion = arr[0];
    let data = [];
    getMigrateConfigureHosts({ osArch, osVersion, paged: false }).then((res) => {
      res.data.data.results.forEach((item) => {
        data.push({
          key: item.id,
          label: item.ip,
        });
        this.data = data;
      });
    });
  },
};
</script>

<style scoped lang="scss">
.transfer-center {
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
</style>